/**
 * Created by huotaol on 2017/5/11.
 */
import React, {Component} from "react";
import PropTypes from "prop-types";
import {ListView, View} from "react-native";
import CustomStyle from "../../../common/style/CustomStyle";
import ModuleCommonHeader from "../../main/module/ModuleCommonHeader";
import CheckDetailItem from "../cardetail/component/CheckDetailItem";
import Util from "../../main/Util";

const DATA_SOURCE = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});

export default class CheckParamDetail extends Component {
    static propTypes = {
        title: PropTypes.string,
        sign: PropTypes.string,
    };

    // 构造
    constructor(props) {
        super(props);
        const {title, sign, carData} = props;
        const attr = carData[sign] ? carData[sign] : [];
        // 初始状态
        this.state = {list: attr};
        this._renderRow = this._renderRow.bind(this);
        this._fetchData = this._fetchData.bind(this);
        if (!carData[sign]) {
            this._fetchData(carData.carsinfo.carid, sign);
        }
    }

    render() {
        return (
            <View style={{flex: 1, paddingBottom: CustomStyle.getActualSizeInVertical(16),}}>
                <ModuleCommonHeader title={this.props.title}/>
                <ListView
                    dataSource={DATA_SOURCE.cloneWithRows(this.state.list)}
                    renderSeparator={this._renderSeparator}
                    renderRow={this._renderRow}/>
            </View>
        );
    }

    _fetchData(carID, sign) {
        const param = {
            carid: carID,
            sign,
        };
        console.log('CheckParamDetail _fetchData param ' + JSON.stringify(param));
        Util.postServer('user/querybkcarsexpand', param, result => {
            console.log('CheckParamDetail  ' + JSON.stringify(result));
            const imagePre = result.data.picurl;
            const list = result.data.carattrlist;
            const resultList = list.map(item => {
                const param = this._processAttr(item.keyvalue, imagePre);
                param.name = item.keyname;
                return param;
            });
            const {sign, carData} = this.props;
            carData[sign] = resultList;
            this.setState({list: resultList});
        }, msg => {
            Util.showToast(msg);
        });
    }

    _processAttr(value, imagePrefix) {
        console.log('CheckParamDetail _processAttr ' + value);
        let normal = value === '正常' || value === '无' || value === '是' || value.length === 0;
        const param = {};
        param.normal = normal;
        if (!normal) {
            if (value.indexOf('#') !== -1) {
                const dataModel = Util.decodePhotoString(value);
                const list = [];
                for (let obj of dataModel) {
                    if (obj.remotePic !== 'null') {
                        list.push({title: obj.name, uri: imagePrefix + obj.remotePic});
                    }
                }
                param.normal = list.length === 0;
                param.extraList = list;
            } else {
                param.extraStr = value;
            }
        }
        return param;
    }


    _renderRow(data) {
        return <CheckDetailItem title={data.name} normal={data.normal} extraStr={data.extraStr}
                                extraList={data.extraList}/>;
    }


    _renderSeparator() {
        return <View style={[CustomStyle.separator]}>
        </View>
    }
}
